<template>
<div id='app' >
  <criteria-paged :model="model" :pager='false' v-ref:paged>
    <criteria partial='criteria' @condition-changed='search' v-ref:criteria>
      <div novalidate class="form-inline auto " partial >
        <p class="bg-info text-center" style="padding: 8px;">气价明细报表</p>
        <div class="flex-row auto" style="justify-content: space-between">
          <div class="form-group" v-if="!$parent.$parent.data.f_files_path">
          <label for="startDate">开始日期:</label>
          <datepicker id="startDate" placeholder="开始日期"
            v-model="model.startDate"
            :value.sync="model.startDate"
            :disabled-days-of-Week="[]"
            :format="'yyyy-MM-dd HH:mm:ss'"
            :show-reset-button="reset">
          </datepicker>
          <label for="endDate">结束日期:</label>
          <datepicker id="endDate" placeholder="结束日期"
            v-model="model.endDate"
            :value.sync="model.endDate"
            :disabled-days-of-Week="[]"
            :format="'yyyy-MM-dd HH:mm:ss'"
            :show-reset-button="reset">
          </datepicker>
          <button class="btn btn-success width-100" @click="search()">查询</button>
          <button class="btn btn-success" @click="$parent.$parent.confirmReport()">保存报表</button>
          </div>
          <span></span>
          <div class="form-group">
            <report-print id='gasprice' top='1cm' left='2cm' width='100%' height='100%'></report-print>
            <report-excel id='gasprice' ></report-excel>
          </div>
        </div>
      </div>
    </criteria>
    <div  partial='list' v-el:handcollect id='gasprice'>
      <table class='tableprint' style="margin: 0px auto"  v-if="!$parent.data.f_files_path">
        <thead>
          <tr>
            <th colspan='5' style="font-weight: normal; text-align: left;">
              <h3 style="text-align: center">气价明细报表</h3>
            </th>
          </tr>
          <tr>
            <th colspan='5' style="font-weight: normal; text-align: center;">
              开始时间：{{model.model.startDate}}&nbsp;&nbsp;&nbsp;
              结束时间：{{ model.model.endDate }}
            </th>
          </tr>
        </thead>
          <tr>
            <td colspan='11'>
          {{{ model.data.substring(26,model.data.length-8) }}}
            </td>
        </tr>
        <tfoot>
          <tr style="text-align: left">
            <th colspan='2'>财务审核：</th>
            <th colspan='2'>收款审核：</th>
            <th colspan='1'>收款员：</th>
          </tr>
        </tfoot>
      </table>
       {{{ $parent.reportStr }}}
     </div>
     <!-- <div partial='list' v-el:handcollect v-if="data.f_files_path">

     </div> -->
  </criteria-paged>

  <modal :show.sync="show" v-ref:modal small backdrop="false">
    <header slot="modal-header" class="modal-header">
      <h4 class="modal-title">输入文件名称</h4>
    </header>
    <article slot="modal-body" class="modal-body">
      <div class="form-group">
        <input  type="text" class="form-control" v-model="filename" placeholder='保存的文件名'>
      </div>
    </article>
    <footer slot="modal-footer" class="modal-footer">
      <button v-show="show" type="button" class="btn btn-default" @click='close'>取消</button>
      <button v-show="show" type="button" class="btn btn-success" @click='confirm(filename)'>确认</button>
    </footer>
  </modal>

</div>
</template>

<script>
import { DataModel } from 'vue-client'
import * as Util from '../../../Util'
import co from 'co'

let saveFile = function * (self) {
// 线验证文件是否重名
let count = yield self.$resetpost('rs/sql/singleTable',
{data: {tablename: 't_report_record', condition: `f_files_name = '${self.filename}'`}},
{resolveMsg: null, rejectMsg: null})
if (count.data.length > 0) {
  self.$showAlert('无法保存，文件名重名', 'warning', 3000)
  return
}
let saveBack = yield self.$resetpost('rs/logic/saveReport', {f_files_content: self.$refs.paged.$els.handcollect.innerHTML,
  f_files_name: self.filename, f_files_type: self.data.f_report_type, f_component_name: 'gas-price',
  f_operator: Util.f.name, f_query_month: `${self.model.model.startDate}-${self.model.model.endDate}`,
  f_outlets: Util.f.f_parentname})

  if (saveBack.data.status === 'succeed') {
    self.show = false
    self.filename = ''
    // 后台保存完成，通知刷新
    self.$dispatch('save-success', self.filename)
  }
}


export default {
title: '气价明细报表',
props: ['data'],
data () {
  return {
    model: new DataModel('rs/report/gasprice', {startDate: 'this.model.startDate', endDate: 'this.model.endDate'}),
    reportStr: null,
    show: false,
    filename: ''
  }
},
ready () {
  if (this.data) {
  }
},
methods: {
  // 根据文件路径获取储存的报表内容
  getFileContent(path) {
    this.$resetpost('rs/logic/getReportFileContent', {f_files_path: path}, {resolveMsg: null, rejectMsg: null}).then((res) => {
      this.reportStr = res.data.filecontent
      this.model.state = '正确'
    })
  },
  confirm () {
    if (!this.filename || this.filename === '') {
      this.$showAlert('无法保存，文件名不能为空', 'warning', 3000)
    }
    let saveGen = saveFile(this)
    co(saveGen)
  },
  close () {
    this.show = false
  },
  // 将报表保存成文件
  confirmReport () {
    this.show = true
    this.filename = this.data.f_report_name + Util.toStandardDateString()
  }
},
watch: {
  'data' (val) {
    if (val.f_files_path) {
      this.getFileContent(val.f_files_path)
    }else {
      this.reportStr = null
    }
  }
}
}
</script>
